*{
    box-sizing: border-box;
}
header{
     font-size: 12px;
 }
 .w{
    width: 1200px;
    margin: 0 auto;
 }
 header .ad-product a{
    display:block;
    width: 100%;
    height: 90px;
    background: url('../images/17461505190610516471.jpg');
    background-repeat: no-repeat;
    background-size:cover;
    background-position: 40% 30%;
}

header span.close{
    position: absolute;
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: rgba(0, 0, 0, .3);
    top: 3%;
    right: 11%;
    text-align: center;
    color: #fff;
    line-height: 22px;
    font-size: 18px;
    cursor: pointer;
}
/* 导航栏 */
header nav {
    width: 100%;
    height: 36px;
    background: #2e2828;
}
header nav .nav-group{
    height: 36px;
}
header nav .nav-group .nav-bar-l,
header nav .nav-group .nav-bar-r{
    width: 485px;
    height: 36px;
}
header nav .nav-group .nav-bar-l{
    float: left;
}
header nav .nav-group .nav-bar-r{
    float: right;
}
header nav .nav-group .nav-bar-l>ul>li,
header nav .nav-group .nav-bar-r>ul>li{
    float: left;
    line-height: 36px;
}
header nav .nav-group .nav-bar-l>ul>li:nth-child(odd),
header nav .nav-group .nav-bar-r>ul>li:nth-child(odd){
    padding: 0 5px;
}
header nav .nav-group .nav-bar-l>ul>li:nth-child(even),
header nav .nav-group .nav-bar-r>ul>li:nth-child(even){
    width: 1px;
    height: 10px;
    background: #414141;
    margin: 13px 0;
}
header nav .nav-group .nav-bar-l>ul>li:last-child>span,
header nav .nav-group .nav-bar-r>ul>li>span{
    display: inline-block;
    width: 5px;
    height:5px;
    border: 1px solid #afafaf;
    border-top: 0;
    border-left: 0;
    margin: 0 0 3px 8px ;
    transform:rotate(45deg);
}
header nav .nav-group .nav-bar-l>ul>li>a,
header nav .nav-group .nav-bar-r>ul>li>a{
    color: #afafaf;
}
header nav .nav-group .nav-bar-l>ul>li>a:hover,
header nav .nav-group .nav-bar-r>ul>li>a:hover{
    color: #fff;
}
.nav-bar-l>ul>li:last-child,
.nav-bar-r>ul>li:nth-child(7) {
    width: 75px;
    position: relative;
    color: #afafaf;
}

.nav-bar-l>ul>li:last-child .secondary-nav,
.nav-bar-r>ul>li:nth-child(7) .secondary-nav {
    display: none;
    position: absolute;
    width: 119px;
    height: 150px;
    right: 0px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    background: #fff;
    text-align: center;
}
.nav-bar-r>ul>li:nth-child(7) .secondary-nav{
    width: 83px;
    height: 80px;
}
.nav-bar-l>ul>li:last-child:hover,
.nav-bar-r>ul>li:nth-child(7):hover{
    background-color: #fff;
    color:#CE242B;
    cursor: pointer;
}
header nav .nav-group .nav-bar-l>ul>li:last-child:hover>span,
.nav-bar-r>ul>li:nth-child(7):hover>span{
    border-color:  #CE242B;
    transform: rotate(-135deg);
}
.nav-bar-l>ul>li:last-child:hover .secondary-nav,
.nav-bar-r>ul>li:nth-child(7):hover .secondary-nav{
    display: block;
    border: 1px solid rgba(224, 221, 221,.6);
    border-top: 0;
}
.nav-bar-l>ul>li:last-child:hover .secondary-nav a,
.nav-bar-r>ul>li:nth-child(7):hover .secondary-nav a{
    color: #777;
}
.nav-bar-l>ul>li:last-child .secondary-nav a:hover,
.nav-bar-r>ul>li:nth-child(7) .secondary-nav a:hover{
    color:#CE242B;
}
.nav-bar-r>ul>li{
    position: relative;
}
.nav-bar-r>ul>li {
    position: relative;
}
.nav-bar-r>ul>li:nth-child(9),
.nav-bar-r>ul>li:nth-child(11){
    color: #afafaf;
}
.nav-bar-r>ul>li .webnav{
    position: absolute;
    width: 893px;
    right: 0px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .1);
    border-bottom-left-radius:8px;
    border-bottom-right-radius:8px;
}
.nav-bar-r>ul>li .webnav dt{
    color: #000;
    font-size: 18px;
    font-weight: 700;
}
.nav-bar-r>ul>li .webnav a{
    color: #414141;
}
.nav-bar-r>ul>li .webnav a:hover{
    color: #CE242B;
}
.nav-bar-r>ul>li .webnav{
    padding: 15px 20px;
}
.nav-bar-r>ul>li .webnav>div{
    width: 178px;
    float: left;
}
.nav-bar-r>ul>li .webnav .icon{
    width: 50px;
    height: 50px;
    background: url("../images/");
}
.nav-bar-r>ul>li:nth-child(9)>.webnav{
    display: none;
}

.nav-bar-r>ul>li:nth-child(9):hover>.webnav{
    display: block;
}
.nav-bar-r>ul>li:nth-child(11){
    position: relative;
}
.downloadApp{
    position: absolute;
    display: none;
    width: 150px;
    right: 0;
}
.downloadApp>div{
    border-bottom: 1px solid #ddd;
    text-align: center;
}
.nav-bar-r>ul>li:nth-child(11):hover>.downloadApp{
    display: block;
}
/* 导航栏结束 */
/* logo区域和商品导航栏 开始 */
.pro-nav{
    height: 74px;
}
.pro-nav::before{
    content: "";
    display: table;
}
.pro-nav .logo{
    float: left;
    width: 205px;
    height: 36px;
    margin-top: 19px;
    background: url('../images/SXppnESYv4K11DBxDFc2.png');
    background-size:contain;
}
.pro-nav .logo h1 {
    display: none;
}
.pro-nav .prolist{
    margin-left: 30px;
float: left;
}
.pro-nav .prolist>ul>li{
    margin: 25px 10px;
    float: left;
}

.pro-nav .prolist>ul>li a{
    color: #000;
    font-size: 16px;
}
.pro-nav .prolist>ul>li a:hover{
    color: #CE242B;
}
.pro-nav .prolist>ul>li:nth-child(1) a,
.pro-nav .prolist>ul>li:nth-child(2) a{
    display: block;
    width: 72px;
    height: 24px;
    border-radius: 10px;
    color: #fff;
    text-align: center;
    line-height:24px;
}
.pro-nav .prolist>ul>li:nth-child(1) a{
    background: #FF9D9E;
}
.pro-nav .prolist>ul>li:nth-child(2) a{
   background: #74C7FF;
}
/* 搜索框 */
.pro-nav .search{
    float: right;
    width: 240px;
    height: 30px;
    margin-top: 25px;
}
.pro-nav .search input{
    float: left;
    width: 205px;
    height: 30px;
    outline: none;
    border: 1px solid #D4D4D4;
    border-right: 0;
    border-radius: 20px;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    background: #F0F0F0;
    text-align: center;

}
.pro-nav .search .search-icon{
    float: left;
    width: 35px;
    height: 30px;
    border: 1px solid #D4D4D4;
    border-left: 0;
    border-radius: 20px;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;

    outline: none;
}
/* logo区域和商品导航栏 结束 */